@import '@/app/styles/variables';

.item {
  display: flex;
  align-items: center;
  gap: 24px;
  align-self: stretch;
}

.text {
  flex: 1;
  word-break: break-word;
}

.number {
  display: flex;
  width: 64px;
  padding: 5px 0px;
  justify-content: center;
  align-items: center;
  border-radius: 30px;
  background: var(--Bright-Pink, #f857b4);
  color: var(--Simple-Morning, #fff);

  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 26px; /* 130% */
}
@include media(sm) {
  .item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
  }
  .number {
    display: flex;
    width: 56px;
    height: 24px;
    padding: 2px 0px;
    justify-content: center;
    align-items: center;

    font-size: 16px;
    line-height: 22px; /* 137.5% */
  }
}
